import Vue from 'vue';
import VueRouter, { RouteConfig } from 'vue-router';
import Home from '../views/Home.vue';

Vue.use(VueRouter);

const routes: Array<RouteConfig> = [
  {
    path: '/',
    name: 'Home',
    component: Home
  },
  {
    path: '/head',
    name: 'Head',
    // 路由懒加载
    component: () => import(/* webpackChunkName: "about" */ '../views/screen/header.vue')
  },
  {
    path: '/footer',
    name: 'Footer',
    // 路由懒加载
    component: () => import(/* webpackChunkName: "about" */ '../views/screen/footer.vue')
  },
  {
    path: '/overview',
    name: 'Overview',
    // 路由懒加载
    component: () => import(/* webpackChunkName: "about" */ '../views/screen/overview.vue')
  },
  {
    path: '/product',
    name: 'Product',
    // 路由懒加载
    component: () => import(/* webpackChunkName: "about" */ '../views/screen/product.vue')
  },
  {
    path: '/task',
    name: 'Task',
    // 路由懒加载
    component: () => import(/* webpackChunkName: "about" */ '../views/screen/task.vue')
  },
  {
    path: '/devicework',
    name: 'Devicework',
    // 路由懒加载
    component: () => import(/* webpackChunkName: "about" */ '../views/screen/devicework.vue')
  },
  {
    path: '/productsche/:fworkId',
    name: 'Productsche',
    // 路由懒加载
    component: () => import(/* webpackChunkName: "about" */ '../views/screen/productSche.vue'),
    props: route => ({
      fworkId: route.params.fworkId       // 动态路径参数
    })
  },
  {
    path: '*',
    name: 'Home',
    component: Home
  }
];

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
});

export default router; 